import { Button, Space, Modal } from 'ant-design-vue';
import { ExclamationCircleOutlined } from '@ant-design/icons-vue';
import { createVNode, defineComponent } from 'vue';

export default defineComponent({
  props: {
    record: {
      type: Object,
      default: () => {
        return {};
      }
    },
    editCall: {
      type: Function,
      default: () => {}
    },
    deleteCall: {
      type: Function,
      default: () => {}
    }
  },
  emits: ['edit', 'delete'],
  setup(props, { emit }) {
    const handleEdit = (_arg: any) => {
      emit('edit', props.record);
    };
    const handleDelete = (_arg: any) => {
      Modal.confirm({
        title: '确定要删除数据？',
        centered: true,
        icon: createVNode(ExclamationCircleOutlined),
        onOk() {
          emit('delete', props.record);
        }
      });
    };
    return {
      handleEdit,
      handleDelete
    };
  },
  render() {
    return (
      <Space>
        <Button
          v-permission={'sysConfig:update'}
          type="dashed"
          onClick={this.handleEdit}
        >
          编辑
        </Button>
        <Button
          v-permission={'sysConfig:delete'}
          type="dashed"
          danger
          onClick={this.handleDelete}
        >
          删除
        </Button>
      </Space>
    );
  }
});
